<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="Pragma" content="no-cache">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/>
    <meta name="format-detection" content="telephone=yes"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
    <title>重置密码</title>
    <!-- Bootstrap core CSS-->
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <style type="text/css">
        body {
            margin: 0;
            padding: 0;
        }

        .modal_content {
            padding: 100px 500px;
            display: flex;
            justify-content: center;
            flex-direction: column;
        }

        .modal_content > div {
            margin-bottom: 20px;
        }

        .modal_content > h5:first-child {
            margin: 30px 0px;
            text-align: center;
            font-size: 30px;
        }

        #dialog label {
            color: #666;
        }

        #npwd {
            display: block;
            width: 100%;
            height: 70px;
            background: none;
            padding-top: 30px;
            border: 0;
            outline: none;
            text-align: center;
            margin-top: -30px;
            font-size: 16px;
            border-bottom: 1px solid rgba(0, 0, 0, .2);
            border-radius: 0;
        }

        #nrpwd {
            display: block;
            width: 100%;
            height: 70px;
            background: none;
            padding-top: 30px;
            border: 0;
            outline: none;
            text-align: center;
            margin-top: -30px;
            font-size: 16px;
            border-bottom: 1px solid rgba(0, 0, 0, .2);
            border-radius: 0;
        }

        .code1 {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            width: 100%;
            height: 70px;
            background: none;
            padding-top: 30px;
            margin-top: -30px;
            font-size: 16px;
            border-bottom: 1px solid rgba(0, 0, 0, .2);
            border-radius: 0;
        }

        #code1 {
            width: calc(100% - 90px);
            height: 55px;
            background: none;
            padding-top: 20px;
            border: 0;
            outline: none;
            text-align: center;
            margin-top: -20px;
            font-size: 16px;
        }

        #btnSendCode1 {
            width: 90px;
            height: 30px;
            padding: 0 5px;
            margin: 0;
            font-size: 14px;
            text-align: center;
            background: transparent;
            border-radius: 30px;
            color: #a07941;
            border-color: #a07941;

        }

        ::-webkit-input-placeholder { /* WebKit browsers */
            font-size: 14px;
            color: rgba(0, 0, 0, .4);
        }

        :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
            font-size: 14px;
            color: rgba(0, 0, 0, .4);
        }

        ::-moz-placeholder { /* Mozilla Firefox 19+ */
            font-size: 14px;
            color: rgba(0, 0, 0, .4);
        }

        :-ms-input-placeholder { /* Internet Explorer 10+ */
            font-size: 14px;
            color: rgba(0, 0, 0, .4);
        }

        .next {
            text-align: center;
            margin: 20px 0;
        }

        .next button {
            width: 100%;
            height: 45px;
            padding: 0;
            margin: 0;
            background: #007BFF;
            color: #fff;
            border: 0;
            outline: none;
            border-radius: 3px;
        }
    </style>
</head>
<body>
<div class="modal_content">
    <form action="/returnLogin" method="post">
        <!--<h5>邮箱验证</h5>-->
        <div>
            <label for="npwd">新密码：</label><br/>
            <input id="npwd" name="npwd" type="password" autocomplete="off" placeholder="新密码：8-19位英文和数字的组合" />
        </div>
        <div>
            <label for="nrpwd">确认密码：</label><br/>
            <input id="nrpwd" name="nrpwd" type="password" autocomplete="off" placeholder="请输入确认密码" />
        </div>
        <div class="next">
            <button type="submit" id="btn_submit">确定</button>
        </div>
    </form>
</div>
<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $("#btn_submit").click(function () {
            var reg_password = /(^[a-zA-Z0-9_-]{8,19}$)/;
            var pass = $('#npwd').val();
            var checkpass = $('#nrpwd').val();
            if(pass==''){
                alert("请输入密码")
                return false;
            }else{
                if (!reg_password.test(pass)) {
                    alert("输入的密码必须是8-19位英文和数字的组合！");
                    return false;
                }else{
                    if(checkpass==''){
                        alert("请输入确认密码")
                        return  false;
                    }else{
                        if (checkpass !== pass) {
                            alert("密码错误！")
                            return false;
                        } else {
                            $("#btn_submit").submit();
                        }
                    }
                }
            }
        });
    });
</script>
</body>
</html>